import React from 'react';
import { Icon, Tooltip, Switch, Row, Col, Button, Form } from 'antd';
import find from 'lodash/find';
import styles from '../styles.less';

function ForArray({ nodePath, parent, current, dispatch, close, form }) {
  const { getFieldDecorator, validateFields } = form;
  const handleSave = () => {
    validateFields((err, values) => {
      if (!err) {
        const result = [];
        // eslint-disable-next-line camelcase
        const { not_empty } = values;

        // eslint-disable-next-line camelcase
        if (not_empty) {
          result.push({
            type: 'not_empty',
          });
        }

        dispatch({
          type: 'update_node_rules_attr',
          payload: {
            nodePath,
            current,
            rules: result,
          },
        });

        close();
      }
    });
  };

  const { rules: oldRules = [] } = current;
  const e = find(oldRules, { type: 'not_empty' });

  return (
    <>
      {/* <Row gutter={16} className={styles.advRow}>
        <Col span={12}>
          <Form.Item
            label={
              <>
                非空&nbsp;
                <Tooltip title="长度不能为0">
                  <Icon type="question-circle-o" style={{ verticalAlign: 'unset' }} />
                </Tooltip>
              </>
            }
          >
            {getFieldDecorator('not_empty', { valuePropName: 'checked', initialValue: !!e })(
              <Switch />
            )}
          </Form.Item>
        </Col>
      </Row> */}

      <div className={styles.advFooter}>
        <Button style={{ marginRight: 8 }} onClick={() => close(false)}>
          取消
        </Button>
        <Button type="primary" onClick={() => handleSave()}>
          保存
        </Button>
      </div>
    </>
  );
}

export default Form.create()(ForArray);
